import type { ButtonProps as AntdButtonProps } from 'antd';
import { Button as AntdButton } from 'antd';
import { ButtonType as AntdButtonType } from 'antd/lib/button';
import cx from 'classnames';
import React from 'react';
import { prefix } from '../config';

export type ButtonProps = AntdButtonProps;
export type ButtonType = AntdButtonType | 'active-default';
export type IconType = 'edit' | 'delete';
export type ButtonConfig = {
  [key in ButtonType]?: {
    type: AntdButtonType;
    className?: string;
  };
};

export interface Props extends AntdButtonProps {
  buttonType?: ButtonType;
  children?: any;
}

const config: ButtonConfig = {
  'active-default': {
    type: 'default',
    className: `${prefix.button}-active-default`,
  },
};
function Button(buttonProps: Props) {
  const { buttonType = 'default', ...props } = buttonProps;
  const info: {
    type?: AntdButtonType;
    className: string;
  } = {
    type: props.type,
    className: '',
  };
  if (config[buttonType]) {
    info.type = config[buttonType]?.type;
    info.className = config[buttonType]?.className || '';
  }

  const antdProps = {
    ...props,
    type: info.type,
  };
  return (
    <AntdButton {...antdProps} className={cx(info.className, props.className)}>
      {props.children}
    </AntdButton>
  );
}

export default Button;
